<template>
  <view>
    <!-- 搜索框 -->
    <yg-search />
    <!-- 轮播图 -->
    <u-swiper
      :list="swiperList"
      name="image_src"
      height="340"
      mode="dot"
    ></u-swiper>
    <!-- 导航模块 -->
    <view class="nav u-flex">
      <navigator
        :url="item.navigator_url + ''"
        redirect
        hover-class="className"
        v-for="item in navList"
        :key="item.name"
        class="u-flex-1 u-p-15"
      >
        <u-image :src="item.image_src" mode="widthFix"></u-image>
      </navigator>
    </view>
    <!-- 楼层 -->
    <floor-view
      v-for="item in floorList"
      :key="item.floor_title.name"
      :obj="item"
    />
  </view>
</template>

<script>
import floorView from '../../components/floor-view/floor-view.vue'
export default {
  components: { floorView },
  data () {
    return {
      swiperList: [],
      navList: [],
      floorList: []
    }
  },
  onLoad () {
    this.getSwiperList()
    this.getNavList()
    this.getFloorList()
  },
  methods: {
    // 获取轮播图数据
    async getSwiperList () {
      // const [err, data] = await uni.request({
      //   url: 'https://api-hmugo-web.itheima.net/api/public/v1/home/swiperdata', //仅为示例，并非真实接口地址。
      // })
      // this.swiperList = data.data.message
      // 使用uview封装后发送请求
      const res = await this.$u.get('/home/swiperdata')
      // console.log(res)
      this.swiperList = res.message
    },
    // 获取导航栏列表
    async getNavList () {
      const res = await this.$u.get('/home/catitems')
      // console.log(res)
      this.navList = res.message
    },
    // 获取导航栏列表
    async getFloorList () {
      const res = await this.$u.get('/home/floordata')
      // console.log(res)
      this.floorList = res.message
    }
  }
}
</script>

<style scoped lang="scss">
</style>
